
import { request } from "../../utils/index";
import regeneratorRuntime from '../../lib/runtime/runtime';

/* 
1 给输入框绑定input事件
2 事件触发了 获取输入框的值
3 把输入框的值拼接成参数 来发送请求
4 请求成功 把返回值 渲染到页面上 
5 添加了防抖
6 绑定 取消事件
  1 绑定点击事件
  2 清空  输入框 值
  3 重置 搜索历史 数组
  4 按钮 自己 隐藏 
 */


let timeId = -1;

Page({
  data: {
    // 输入状态
    isInpStatus: false,
    // 搜索结果的数组
    list: [],
    // 输入框的值
    inpValue:""
  },
  // 输入框的值 改变 就会触发
  handleInput(e) {
    //  2 获取输入框的值
    const { value } = e.detail;

    // 判断输入框的值是否为空
    // ""  "        "
    // 输入 非法 直接返回 不再往下执行

    clearTimeout(timeId);
    
    
    if (!value.trim()) {
      this.setData({ list: [] });
      return;
    }

    // 改变输入状态
    this.setData({
      isInpStatus:true
    })

    timeId = setTimeout(() => {
      this.getList(value);
    }, 600);

  },
  async getList(value) {
    // 3 发送请求
    const list = await request({ url: "goods/qsearch?query=" + value });

    this.setData({
      list
    })
    // 自己帮我们计算 
    console.count("触发的次数");

  },
  handleStatusCancel(){
    // 2 清空  输入框 值

    // 3 重置 搜索历史 数组
    // 4 按钮 自己 隐藏 
    this.setData({
      inpValue:"",
      list:[],
      isInpStatus:false
    })
  }
})